<template>
  <section class="archive-examint-table__item main__page">
    <mivaPagination :isRight="true" />
    <br />
    <el-table :data="logs" border size="mini">
      <el-table-column align="center" label="稿件id" prop="aid" width="80" />
      <el-table-column header-align="center" label="稿件名">
        <a :href="baseUrl | mixinUrl(row.aid)" :title="archiveTitle(row.archive)" class="archive-title__item" rel="noopener noreferrer" slot-scope="{row}" target="_blank">{{ archiveTitle(row.archive) }}</a>
      </el-table-column>
      <el-table-column align="center" label="审核员" prop="admin.nickname" width="130" />
      <el-table-column header-align="center" label="审核结果" width="82">
        <template slot-scope="{row}">
          <el-tag :type="row.action==2?'success': 'danger' " size="mini">{{ row.action | actionType }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column header-align="center" label="附加消息" prop="mark" />
      <el-table-column align="center" label="操作时间" width="155">
        <template slot-scope="{row}">
          <span class="el-icon-time">{{ new Date(row.created_at) | parseTime('{y}-{m}-{d} {h}:{i}:{s}') }}</span>
        </template>
      </el-table-column>
    </el-table>
    <br />
    <mivaPagination />
  </section>
</template>

<script>
export default {
    components: {
        mivaPagination: {
            props: ['isRight'],
            computed: {
                layout() {
                    return this.isRight ? '->, total, prev, pager, next' : ' total, prev, pager, next';
                },
            },
            render() {
                const { page, pageSize, total, currentChangeHandler } = this.$parent;
                return <el-pagination
                    current-page={page}
                    pageSize={pageSize}
                    total={total}
                    on-current-change={currentChangeHandler}
                    layout={this.layout}
                    next-text="下一页"
                    prev-text="上一页"
                />;
            },
        },
    },
    filters: {
        actionType(code) {
            const obj = { 2: '通过审核', 3: '拒绝审核' };
            return obj[code];
        },
        mixinUrl(url, id) {
            return `${url}/${id}`;
        },
    },
    props: {
        data: {
            type: Object,
            required: true,
        },
        baseUrl: {
            type: String,
            required: true,
        },
        page: {
            type: [Number, String],
            default: 1,
        },
        pageSize: {
            type: [Number, String],
            default: 20,
        },
    },
    computed: {
        total() {
            return this.data.count || 0;
        },
        logs() {
            return this.data.logs || [];
        },
    },
    methods: {
        archiveTitle(archive) {
            return archive ? archive.title || '没有标题' : '稿件已被删除';
        },
        tableRowClassName({ row }) {
            if (row.action_type === '3') {
                return 'warning-row';
            }
            if (row.action_type === '2') {
                return 'success-row';
            }
            return '';
        },
        async currentChangeHandler(page) {
            this.$emit('change', page);
        },
    },
};
</script>

<style lang="scss">
.archive-examint-table__item {
  .archive-title__item {
    white-space: nowrap;
    overflow-x: auto;
  }
}

.el-table .warning-row {
  background: oldlace;
}

.el-table .success-row {
  background: #f0f9eb;
}
</style>
